<div class="layui-form" lay-filter="layuiadmin-form-admin" id="layuiadmin-form-admin" style="padding: 20px 30px 0 0;">
    <div class="layui-form-item">
        <label class="layui-form-label">父级</label>
        <div class="layui-input-block" id="permission-select-dom"></div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">名称</label>
        <div class="layui-input-block">
            <input type="text" name="name" required placeholder="请输入控制器方法" autocomplete="off"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">选择权限</label>
        <div class="layui-input-block">
            <button type="button" class="layui-btn layui-btn-primary  layui-btn-xs"
                    onclick="checkAll('#LAY-auth-tree-index')">全选
            </button>
            <button type="button" class="layui-btn layui-btn-primary  layui-btn-xs"
                    onclick="uncheckAll('#LAY-auth-tree-index')">全不选
            </button>
            <button type="button" class="layui-btn layui-btn-primary  layui-btn-xs"
                    onclick="showAll('#LAY-auth-tree-index')">全部展开
            </button>
            <button type="button" class="layui-btn layui-btn-primary  layui-btn-xs"
                    onclick="closeAll('#LAY-auth-tree-index')">全部隐藏
            </button>
            <div id="LAY-auth-tree-index"></div>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">状态</label>
        <div class="layui-input-block">
            <input type="radio" name="status" value="1" title="开启" checked>
            <input type="radio" name="status" value="0" title="禁用">
        </div>
    </div>
    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit lay-filter="LAY-user-back-submit" id="LAY-user-back-submit" value="确认">
    </div>
</div>
<script type="text/html" id="permission-select">
    <select name="parent_id" lay-filter="type">
        {{# layui.each(d.list, function(index, item) { }}
        <option value="{{item.value}}">{{item.name}}</option>
        {{# });}}
    </select>
</script>
<script src="/static/layuiadmin/layui/layui.js"></script>
<script>
    layui.config({
        base: '/static/admin/' //静态资源所在路径
    }).extend({
        index: 'lib/index', //主入口模块
    }).use(['index', 'form', 'authtree', 'laytpl'], function () {
        var $ = layui.$, form = layui.form, authtree = layui.authtree, laytpl = layui.laytpl;
        $.ajax({
            url: "{:url('group/select')}",
            dataType: 'json',
            success: function (data) {
                console.log(data);
                var selectList = authtree.treeConvertSelect(data.trees, {
                    childKey: 'list',
                    primaryKey: 'id',
                    parentKey: 'parent_id',
                });
                laytpl($('#permission-select').html()).render({
                    list: selectList,
                }, function (html) {

                    $('#permission-select-dom').append(html);
                });
                form.render('select');

            }
        });
        // 一般来说，权限数据是异步传递过来的

        $.ajax({
            url: "{:url('group/ruleSelect')}",
            dataType: 'json',
            success: function (data) {
                // 渲染时传入渲染目标ID，树形结构数据（具体结构看样例，checked表示默认选中），以及input表单的名字
                authtree.render('#LAY-auth-tree-index', data.trees, {
                    inputname: 'ids[]'
                    , layfilter: 'lay-check-auth',
                    openchecked: true,
                    autochecked: true
                     ,dblshow: true
                    // ,dbltimeout: 180
                   ,autoclose: false
                    // ,autochecked: false
                    // ,openchecked: false
                    ,'collapseLeafNode': false
                    // ,openall: true
                    // ,hidechoose: true
                    // ,checkType: 'radio'
                     ,checkedKey: 'checked'
                    // ,disabledKey: 'disabled'
                     ,checkSkin: 'primary'

                    // ,'themePath': 'themes/'
                    , autowidth: true
                });
            },
        });

    });

    // 全选样例
    function checkAll(dst){
        layui.use(['jquery', 'layer', 'authtree'], function(){
            var layer = layui.layer;
            var authtree = layui.authtree;

            authtree.checkAll(dst);
        });
    }
    // 全不选样例
    function uncheckAll(dst){
        layui.use(['jquery', 'layer', 'authtree'], function(){
            var layer = layui.layer;
            var authtree = layui.authtree;

            authtree.uncheckAll(dst);
        });
    }
    // 显示全部
    function showAll(dst){
        layui.use(['jquery', 'layer', 'authtree'], function(){
            var layer = layui.layer;
            var authtree = layui.authtree;

            authtree.showAll(dst);
        });
    }
    // 隐藏全部
    function closeAll(dst){
        layui.use(['jquery', 'layer', 'authtree'], function(){
            var layer = layui.layer;
            var authtree = layui.authtree;

            authtree.closeAll(dst);
        });
    }
</script>